<script src="__PUBLIC__/js/package.js"></script> 
<script>
$(function(){
    // 一级品牌动作
    $("select.brand_select").change(function(event) {
    	$(this).nextAll("select.models_select").children("option:gt(0)").remove();
    	var obj = $(this);
        var url = "<{:U('Package/getBrand')}>";
        var param = {"bid":$(this).val()};
        $.getJSON(url, param, function(res){
            obj.next("select").html(res);
        });
    });
    // 二级品牌动作
    $("select.series_select").change(function(event) {
    	var obj = $(this);
        var url = "<{:U('Package/getLeafBrand')}>";
        var param = {"bid":$(this).val()};
        $.getJSON(url, param, function(res){
            obj.next("select").html(res);
        });
    });
    // 三级品牌动作
    $("select.models_select").change(function(event) {
    	var _index = $(this).parents('td').index()-1;
    	var div = $(this).parents('.carbox');
    	// 当前节点
    	var treeObj = $.fn.zTree.getZTreeObj("option_tree");
    	var nodes = treeObj.getSelectedNodes();
    	var nid = nodes[0].id;
    	// 当前车型
    	var aid = $(this).val();
        var url = "<{:U('Teardown/getVehicle')}>";
        var param = {"aid":aid, "nid":nid};
        $.getJSON(url, param, function(res){
        	// 设置当前操作的缩略图
        	url = "<{:U('Teardown/vehicle')}>?aid=" + aid;
        	div.children('a').attr("href", url);
        	div.find("img").attr("src", res.url);
        	// 设置当前操作的车型
        	brand = "<a href='" + url + "'>" + res.brand + "</a>";
            $(".tbset td").eq(_index).html(brand);
            // 设置具体参数
        	$("#ajax_sub_content tr").each(function(index, el) {
            	var field = $(this).children("th").text();
            	var str = res.node? res.node[field.toLocaleLowerCase()] : "";
            	$(this).children('td').eq(_index).html(str||"-");
            	$(".buttonDN td").eq(_index).find("span").removeClass("no").addClass("delect");            
            });	
        });
    });
	// 点击按钮取消对比模式
	$("button[name='compare']").click(function(event) {
		// 部件信息模式
		var url = "<{:U('Teardown/dispatch')}>";			
		// 当前节点
		var treeObj = $.fn.zTree.getZTreeObj("option_tree");
		var nodes = treeObj.getSelectedNodes();
		var nid = nodes[0].id;
		// 获取数据
		var param = {"aid": $(":hidden[name='aid']").val(), "nid":nid};
		$.getJSON(url, param, function(res){
			!res || $("div.content").html(res.data);
		});
	});
})
</script>
<!-- 当前位置 -->
<div class="breadCrumbs"><i class="icon icon-home"></i><span><{$title}></span></div>
<!-- 对比数据表格 -->
<button class="layui-btn layui-btn-small" name="compare" compared="1"><i class="icon icon-document"></i>Cancel compare</button>
<button class="layui-btn layui-btn-small layui-btn-normal fr"><i class="icon icon-add"></i>Add columns</button>
<div class="component_performance_show compare">
	<!-- 顶部操作区 -->
	<div class="select_type">
		<table class="tbcs info buttonDN">
			<tbody>
				<tr>
					<th>
						<div class="setbox">
							<label><input type="checkbox" value="height" name="radioShow">Highlight differences</label>
							<label><input type="checkbox" value="height" name="radioShow">Hide the same parameters</label>
							<label><input type="checkbox" value="height" name="radioShow">Hide No content parameters</label>
						</div>
					</th>
					<!-- 当前车型不参与变化 -->
					<td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="<{$auto.url}>" alt=""></a>
							<select>
								<option value="0" selected="selected"><{$auto["brand"][0]}></option>
							</select>
							<select>
								<option value="0" selected="selected"><{$auto["brand"][1]}></option>
							</select>
							<select>
								<option value="0" selected="selected"><{$auto["brand"][2]}></option>
							</select>
							<div class="control" style="height: 20px;"></div>
						</div>
					</td>
					<td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="__PUBLIC__/images/product/duibinopic.gif" alt=""></a>
							<select class="brand_select" name="">
								<option value="0" selected="selected">-Brand-</option>
								<foreach name="all_brands" item="vo">
									<option value="<{$key}>"><{$vo}></option>
								</foreach>
							</select>
							<select class="series_select" name="">
								<option value="0" selected="selected">-Series-</option>
							</select>
							<select class="models_select" name="">
								<option value="0" selected="selected">-Models-</option>
							</select>
							<div class="control">
								<input type="button" value="<<" class="lt" /> 
								<span class="delect">delect</span>
								<input type="button" value=">>" class="rt" />
							</div>
						</div>
					</td>
					<td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="__PUBLIC__/images/product/duibinopic.gif" alt=""></a>
							<select class="brand_select" name="">
								<option value="0" selected="selected">-Brand-</option>
								<foreach name="all_brands" item="vo">
									<option value="<{$key}>"><{$vo}></option>
								</foreach>
							</select>
							<select class="series_select" name="">
								<option value="0" selected="selected">-Series-</option>
							</select>
							<select class="models_select" name="">
								<option value="0" selected="selected">-Models-</option>
							</select>
							<div class="control">
								<input type="button" value="<<" class="lt" /> 
								<span class="delect">delect</span>
								<input type="button" value=">>" class="rt" />
							</div>
						</div>
					</td>
					<td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="__PUBLIC__/images/product/duibinopic.gif" alt=""></a>
							<select class="brand_select" name="">
								<option value="0" selected="selected">-Brand-</option>
								<foreach name="all_brands" item="vo">
									<option value="<{$key}>"><{$vo}></option>
								</foreach>
							</select>
							<select class="series_select" name="">
								<option value="0" selected="selected">-Series-</option>
							</select>
							<select class="models_select" name="">
								<option value="0" selected="selected">-Models-</option>
							</select>
							<div class="control">
								<input type="button" value="<<" class="lt" /> 
								<span class="delect">delect</span>
								<input type="button" value=">>" class="rt" />
							</div>
						</div>
					</td>
					<!-- <td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="__PUBLIC__/images/product/duibinopic.gif" alt=""></a>
							<select class="brand_select" name="">
								<option value="0" selected="selected">-Brand-</option>
								<foreach name="all_brands" item="vo">
									<option value="<{$key}>"><{$vo}></option>
								</foreach>
							</select>
							<select class="series_select" name="">
								<option value="0" selected="selected">-Series-</option>
							</select>
							<select class="models_select" name="">
								<option value="0" selected="selected">-Models-</option>
							</select>
							<div class="control">
								<input type="button" value="<<" class="lt" /> 
								<span class="delect">delect</span>
								<input type="button" value=">>" class="rt" />
							</div>
						</div>
					</td>
					<td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="__PUBLIC__/images/product/duibinopic.gif" alt=""></a>
							<select class="brand_select" name="">
								<option value="0" selected="selected">-Brand-</option>
								<foreach name="all_brands" item="vo">
									<option value="<{$key}>"><{$vo}></option>
								</foreach>
							</select>
							<select class="series_select" name="">
								<option value="0" selected="selected">-Series-</option>
							</select>
							<select class="models_select" name="">
								<option value="0" selected="selected">-Models-</option>
							</select>
							<div class="control">
								<input type="button" value="<<" class="lt" /> 
								<span class="delect">delect</span>
								<input type="button" value=">>" class="rt" />
							</div>
						</div>
					</td>
					<td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="__PUBLIC__/images/product/duibinopic.gif" alt=""></a>
							<select class="brand_select" name="">
								<option value="0" selected="selected">-Brand-</option>
								<foreach name="all_brands" item="vo">
									<option value="<{$key}>"><{$vo}></option>
								</foreach>
							</select>
							<select class="series_select" name="">
								<option value="0" selected="selected">-Series-</option>
							</select>
							<select class="models_select" name="">
								<option value="0" selected="selected">-Models-</option>
							</select>
							<div class="control">
								<input type="button" value="<<" class="lt" /> 
								<span class="delect">delect</span>
								<input type="button" value=">>" class="rt" />
							</div>
						</div>
					</td>
					<td class="btn_delbar_partent">
						<div class="carbox">
							<a href="#"><img src="__PUBLIC__/images/product/duibinopic.gif" alt=""></a>
							<select class="brand_select" name="">
								<option value="0" selected="selected">-Brand-</option>
								<foreach name="all_brands" item="vo">
									<option value="<{$key}>"><{$vo}></option>
								</foreach>
							</select>
							<select class="series_select" name="">
								<option value="0" selected="selected">-Series-</option>
							</select>
							<select class="models_select" name="">
								<option value="0" selected="selected">-Models-</option>
							</select>
							<div class="control">
								<input type="button" value="<<" class="lt" /> 
								<span class="delect">delect</span>
								<input type="button" value=">>" class="rt" />
							</div>
						</div>
					</td> -->
				</tr>
			</tbody>
		</table>
	</div>
	<!-- 固定导航区 -->
	<div class="config_nav" style="display:none;">
		<table class="tbset">
			<tbody>
				<tr>
					<th>Vehicle information</th>
					<td><{$brand}></td>
					<td></td>
					<td></td>
					<td></td>
					<!-- <td></td>
					<td></td>
					<td></td>
					<td></td> -->
				</tr>
			</tbody>
		</table>
	</div>
	<!-- 主题内容 -->	
	<div class="conbox carPerformance" id="ajax_sub_content">
	<notempty name="node">
		<table class="tbcs tab">
			<foreach name="node" item="vo">
				<tr>
					<th><{$key|ucfirst}></th>
					<td><notempty name="vo"><{$vo}><else/>-</notempty></td>
					<td></td>
					<td></td>
					<td></td>
					<!-- <td></td>
					<td></td>
					<td></td>
					<td></td> -->
				</tr>
			</foreach>
		</table>
		<blockquote class="layui-elem-quote end"><i class="icon icon-noticeText"></i>THE END!</blockquote>
	<else/>
		<blockquote class="layui-elem-quote layui-quote-nm">Nothing is found...</blockquote>
	</notempty>
	</div>
</div>